基于Java spring + vue3 + nuxt构建的内容管理系统
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

211 lines
5.1 KiB

<template>
<UserCard :form="form" title="社区" desc="分享研发成果 交流技术经验" :avatar="user?.avatar"/>
<CardList :list="list" :disabled="disabled" @done="onSearch" />
</template>
<script setup lang="ts">
import type {ApiResult, PageResult} from "~/api";
import {useServerRequest} from "~/composables/useServerRequest";
import {useWebsite} from "~/composables/configState";
import type {BreadcrumbItem} from "~/types/global";
import type {Navigation} from "~/api/cms/navigation/model";
import {getIdBySpm, openSpmUrl} from "~/utils/common";
import type {Article} from "~/api/cms/article/model";
import useFormData from "~/utils/use-form-data";
import LikeArticle from "~/pages/detail/components/LikeArticle.vue";
import CardList from "~/pages/ask/components/CardList.vue";
import type {Company, CompanyParam} from "~/api/system/company/model";
import type {User} from "~/api/system/user/model";
// 引入状态管理
const route = useRoute();
const website = useWebsite();
const user = useUser();
const breadcrumb = ref<BreadcrumbItem>();
const previousArticle = ref<Article>();
const nextArticle = ref<Article>();
const disabled = ref<boolean>(false);
const showContent = ref<boolean>();
const showPassword = ref<boolean>();
const list = ref<Article[]>([]);
const page = ref<number>(1);
// 配置信息
const {form, assignFields} = useFormData<Article>({
// 文章id
articleId: undefined,
// 文章标题
title: undefined,
// 分类类型
type: undefined,
// 展现方式
showType: undefined,
// 文章类型
categoryId: undefined,
// 文章分类
categoryName: undefined,
parentId: undefined,
parentName: undefined,
parentPath: undefined,
// 封面图
image: undefined,
// 附件
files: undefined,
// 缩列图
thumbnail: undefined,
// 视频地址
video: undefined,
// 上传的文件类型
accept: undefined,
// 来源
source: undefined,
// 文章内容
content: undefined,
// 虚拟阅读量
virtualViews: undefined,
// 实际阅读量
actualViews: undefined,
// 访问权限
permission: undefined,
// 访问密码
password: undefined,
password2: undefined,
// 用户ID
userId: undefined,
// 用户昵称
nickname: undefined,
// 账号
username: undefined,
// 用户头像
// userAvatar: undefined,
author: undefined,
// 所属门店ID
shopId: undefined,
//
likes: undefined,
// 排序
sortNumber: undefined,
// 备注
comments: undefined,
// 状态
status: undefined,
// 创建时间
createTime: undefined,
// 更新时间
updateTime: undefined
});
// 搜索表单
const where = reactive<CompanyParam>({
keywords: ''
});
// 验证密码
const checkPassword = async () => {
const {data: response} = await useServerRequest<ApiResult<unknown>>('/cms/cms-article/checkArticlePassword', {
query: {
password: form?.password,
password2: form.password2
}
})
if (response.value?.code === 0) {
showPassword.value = false;
showContent.value = true;
} else {
ElMessage.error(response.value?.message);
}
}
const onSearch = () => {
if(!disabled.value){
page.value++;
reload(route.path);
}
}
// 请求数据
// const reload = async (path: string) => {
//
// if (response.value?.data) {
// if (list.value.length < response.value?.data.count) {
// disabled.value = false;
// if (response.value?.data.list) {
// list.value = list.value.concat(response.value?.data.list);
// }
// } else {
// disabled.value = true;
// }
// if (response.value.data.count == 0) {
// resultText.value = '暂无相关结果'
// }
// }
// }
// 请求数据
const reload = async () => {
const {data: response} = await useServerRequest<ApiResult<PageResult<Article>>>('/cms/cms-article/page', {
params: {
page: page.value,
limit: 8,
userId: route.params.userId,
keywords: where.keywords
}
})
if(response.value?.data){
if (list.value.length < response.value?.data.count) {
disabled.value = false;
if (response.value?.data.list) {
list.value = list.value.concat(response.value?.data.list);
}
}else {
disabled.value = true;
}
}
const { data: userInfo } = await useServerRequest<ApiResult<User>>(`/system/user/getByUserId/${getIdBySpm(5)}`)
console.log(userInfo.value)
// if (response.value?.data) {
// assignFields(response.value.data)
// if (form.permission === 1) {
// console.log('登录可见')
// return;
// }
// if (form.permission === 2) {
// console.log('需要密码')
// showPassword.value = true;
// return;
// }
// form.parentPath = getSpmUrl(`/category`, form, form.articleId);
// console.log(form.parentPath)
// }
// seo
useHead({
title: `${form.title} - ${website.value.websiteName}`,
bodyAttrs: {
class: "page-container",
}
});
// 面包屑
breadcrumb.value = form
}
watch(
() => route.path,
(path) => {
console.log(path, '=>Path')
reload();
},
{immediate: true}
);
</script>
<style lang="less">
.content {
img {
max-width: 100%;
}
}
</style>